<div class="CommonHeader">
  <div class="CommonBackBtn"></div>
  <div class="CommonTitle">我的订单</div>
</div>

<div class="CommonMain">
  <div
    class="am-tabs OrderList"
    data-am-tabs="{noSwipe: 1}"
    id="doc-tab-demo-1"
  >
    <!--订单分类-->
    <ul class="am-tabs-nav am-cf">
      <li class="am-active">
        <a href="javascript:void(0)" onclick="orders(4)">全部</a><b></b>
      </li>
      <li>
        <a href="javascript:void (0)" onclick="orders(1)">待付款</a><b></b>
      </li>
      <li>
        <a href="javascript:void (0)" onclick="orders(2)">已付款</a><b></b>
      </li>
      <li>
        <a href="javascript:void (0)" onclick="orders(3)">待评价</a><b></b>
      </li>
    </ul>
    <div
      class="am-tabs-bd"
      style="padding-bottom:1rem;position: fixed;width:100%;height:80%;overflow-y:auto;-webkit-overflow-scrolling: touch;"
    >
      <!--全部-->
      <div class="am-tab-panel am-active am-in" id="ul4"></div>
      <!--待付款-->
      <div class="am-tab-panel" id="ul1"></div>
      <!--已付款-->
      <div class="am-tab-panel" id="ul2"></div>
      <!--待评价-->
      <div class="am-tab-panel" id="ul3"></div>
    </div>
  </div>
</div>
<script type="text/javascript" src="__CDN__/assets/js/zepto.min.js"></script>
<script
  type="text/javascript"
  src="__CDN__/assets/js/PullToRefresh.min.js"
></script>
<script>
  var n = 0,
    flag = true
  var status = "{$status ?? ''}"

  function orders(statust) {
    status = statust
    re_ajax(1, status)
  }

  var refreshBox = new PullToRefresh({
    container: ".am-tabs-bd",

    up: {
      callback: function() {
        setTimeout(function() {
          n++
          re_ajax(n, status)
          refreshBox.endUpLoading(flag)
        }, 1000)
      }
    }
  })
  re_ajax(1, 4)
  function re_ajax(page, status) {
    $.ajax({
      type: "POST",
      url: "{$http_url}/index/user/orderlist",
      dataType: "json",
      data: {
        page: page,
        status: status
      },
      success: function(data) {
        if (page == 1 || page == 0) {
          $("#ul" + status).html("")
        }
        var html = ""
        data.data.forEach(function(v) {
          html += '  <div class="shopList am-cf">'
          html += ' <a href="#">'
          html += '   <div class="text  am-fl"> '
          html += '   <p class="p1">' + v.name + "</p>"
          html += ' <p class="p2">时间:' + v.createtime + " </p>"
          html += ' <p class="p3">¥<span>' + v.total + "</span></p>"
          html += " </div>"
          html += ' <div class="StateBtn am-fr">'
          html += ' <p class="p1">' + v.comment_name + "</p>"
          html +=
            '  <p class="p2 dmColor5"  ' +
            v.style +
            '  id="' +
            v.shoporder_id +
            "&litestore_shop_id=" +
            v.litestore_shop_id +
            '" onclick="opens(this)">' +
            v.p +
            "</p>"
          html += "  </div>"
          html += "  </a>"
          html += "  </div>"
        })
        $("#ul" + status).append(html)
        if (html == "") {
          flag = false
          refreshBox.endUpLoading(flag)
        } else {
          refreshBox.endUpLoading(true)
        }
      },
      error: function(jqXHR) {
        console.log("Error: " + jqXHR.status)
      }
    })
  }
  function opens(obj) {
    window.location.href = "{:url('user/comment')}?shoporder_id=" + obj.id
  }
</script>
